<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta name='viewport' content='width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0'>
    <meta name="apple-touch-fullscreen" content="YES">
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <script src="js/swiper.animate.min.js" type="text/javascript" charset="utf-8"></script>
    <title>demo</title>
    <script>
        document.documentElement.style.height=document.documentElement.clientHeight+'px';
        document.documentElement.style.fontSize=document.documentElement.clientWidth/16+'px';
    </script>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/share.css">
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/bullet.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/mode.js"></script>
    <script src="js/base.js"></script>
    <style type="text/css">
    	.logo_img{
			width: 3.164rem;
			position: absolute;
			left: 50%;
			margin-left: -1.582rem;
			top: 4%;
		}
		/*.logo{*/
			/*height: 3.1rem;*/
		/*}*/
		#upicon{
	        position: fixed;
	        bottom: 0px;
	        left: 50%;
	        margin-left: -25px;
	        z-index: 10;
	    }
	    .iconUpAnimation{
	        -webkit-animation: iconUp 1.25s infinite;
	        -o-animation: iconUp 1.25s infinite;
	        animation: iconUp 1.25s infinite;
	    }
		@keyframes iconUp{
	        0%{
	            opacity: 1;
	            transform: translateY(-50px);
	        }
	        100%{
	            opacity: 0.5;
	            transform: translateY(50px);
	        }
	    }
	    .input,textarea{
			border-top:0.13rem solid #C7BA9A;
				border-right:0.13rem solid #C7BA9A ;
		}
		textarea::-ms-input-placeholder{
			color: #888888;
		}
		textarea::-moz-placeholder{
			color: #888888;

		}
		textarea::-webkit-input-placeholder{
			color: #888888;

		}

        .liuyan{
            transform:translateX(-50%);
        }
    </style>
</head>
</head>
<body>

<section class="page-one">
<div class="swiper-container model">
	<div class="swiper-wrapper">
	<div class="swiper-slide">
		<div class="">
			<div class="logo">
				<img src="img/logo.png" class="logo_img"/>
			</div>
		    <div class="photo-area">
		        <div class="photo-content" style="background: #9DACB4;width:14.95rem;height: 15.9787rem">
		            <div class="photo-bg" style="">
		                <div class="photo">
		                    <div id='LINK17CB011829D54DDE627250573AB67AA2' style='pointer-events:none;width:0.23rem; height:0rem;' data-link='043779AD1D88156D72CF7D276196291500000091584B32DD' ></div>
		                    <div id='EMP17CB011829D54DDE627250573AB67AA2' style="position:absolute; margin:0rem;  background-color:rgba(0,0,0,1); width:100%; height:100%;display:none;overflow-x:hidden;overflow-y:hidden;">
		                        <div id='EMP17CB011829D54DDE627250573AB67AA2_stage' class='pageStage' style=" background-color:rgba(0,0,0,0);position:absolute;width:100%;height:100%;  z-index: 2;">
		                            <div id='EMP2C34382C14251AC928A5056A58FC69D6' style="margin: 2rem auto;opacity: 1;z-index: 10;" ></div><!-- /* ��??��??��??_1 */ -->
		                            <div id='EMP790D18C959616064386A52DB1EED1FBA' style="margin: 0 auto;pointer-events:auto; background-image:url('resources/0_ewm.png');background-repeat:no-repeat;background-size:0.67rem 0.67rem;background-position:0% 0%;position:absolute;left:100%;top:0%;margin-left:-1.485rem;margin-top:5px;width:0.67rem;height:0.67rem;opacity:1; z-index:20;" ><img style='width:100%;height:0;display:none;' src='resources/0_ewm.png' />
		                            </div><!-- /* ��?????_1 */ -->
		                            <div id='EMP737E69E779B2456D345E66D6307D538A' style="pointer-events:auto;visibility:hidden;background-size:3rem 3rem;background-position:0% 0%;position:absolute;left:4rem;top:3.14rem;width:3rem;height:3rem;opacity:1; z-index:30;-webkit-touch-callout: none;-webkit-text-size-adjust: none;-webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-user-select: none;" ></div><!-- /* empQrcode_1 */ -->
		                        </div>
		                    </div><!-- /* page:  ???�W?????_1 */ -->
		                </div>
		                <div class="drag-area" style="z-index:1111">
		                    <img src="images/1/oldman.png" alt="" id="tag-pic">
		                </div>
		            </div>
		        </div>
		    </div>
		    <div class="" style="position: relative;margin-top: 2rem;">
		    	<img src="img/icon_left.gif" class="icon_img_left icon_img" style="position: absolute;height: 1rem;left: 0%;top: 50%;"/>
		    	<div class="tag-area clearfix" style="">
			        <div class="swiper-container nav">
			            <div class="swiper-wrapper">
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/oldman.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/oldman-pic.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/deer.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/tree.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/snow.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/oldman.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/oldman-pic.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/deer.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/tree.png" alt=""></div>
			                <div class="swiper-slide swing" data-off="select"><img src="images/1/snow.png" alt=""></div>
			            </div>
			        </div>
			    </div>
			    <img src="img/icon_right.gif" class="icon_img_right icon_img" style="position: absolute;height: 1rem;right: 0%;top: 50%;"/>
		    </div>
		    <div class="" id="next" style="position: absolute;bottom: 0;left: 40%;width: 20%;height: 15%;background: ;z-index: ;">
		    	<div id="upicon" class="iconUpAnimation">
			        <img src="img/icon_up.png"  style="height: 1.5rem;width: 1.5rem;"/>
			    </div>
		    </div>
		</div>
	</div>
	<div class="swiper-slide" style="background: ;">
		<div class="photo-area" style="position: absolute;left:50%;top: 15%;">
	        <div class="liuyan" style="background-color: ">
	        	<div class="textarea input_border">
					<textarea class="" name="" rows="" cols="" style="resize:none;width: 14.98rem;height: 10rem;background: #E4D8C6;text-indent: 0.5rem;line-height: 2;font-size: 1.0rem;" placeholder="分享文字(150字以内):" ></textarea>
				</div>
				<div class="input" style="height: 2rem;text-indent: 0;background: #E4D8C6;text-align: left;line-height: 2rem;margin-top: 1rem;text-indent: 0.5rem;">
					发送人: <input class="" type="text" name="" id="" value="" style="background: none;"/>
				</div>
	        </div>
	    </div>


	</div>

</section>
<script src="js/jquery.min.js"></script>
<script src="js/3d-base.js"></script>
<script src="js/jquery.qrcode.min.js"></script>
<script src="js/share.js"></script>
<script src="js/swiper.min.js"></script>
<script src="js/3deye.min.js"></script>
<script src="js/hammer.js"></script>
<script src="js/dragPic.js"></script>
<script src="js/index.js"></script>
<script src="empcommon/allone.min.js" type="text/javascript"></script>

<script type= "text/javascript">
var EmpFirstShowPage={pages:["EMP17CB011829D54DDE627250573AB67AA2","END"],first:0,EMP17CB011829D54DDE627250573AB67AA2:[[""],[""]]},PageInitFunc={},PageExitFunc={};window.addEventListener("load",function(){PageInitFunc.EMP17CB011829D54DDE627250573AB67AA2&&PageInitFunc.EMP17CB011829D54DDE627250573AB67AA2()},!1);jQuery("#EMP790D18C959616064386A52DB1EED1FBA").bind("tapone",function(a){$(this).creatOverLayDiv("_EMP737E69E779B2456D345E66D6307D538A",a)});var plugin_EMP737E69E779B2456D345E66D6307D538A=empEnsureFather("EMP737E69E779B2456D345E66D6307D538A","EMP17CB011829D54DDE627250573AB67AA2_stage");(function(){window._EMP737E69E779B2456D345E66D6307D538A=$(this).createQrcode({divid:"EMP737E69E779B2456D345E66D6307D538A",targetUrl:"\u8bf7\u8f93\u5165\u76ee\u6807\u5b57\u7b26\u4e32\u6216Url",logoimg:"",qrcodeforegroundColor:"rgb(0,0,0)",qrcodebackgroundColor:"rgb(255,255,255)",qrcodeCorrectLevel:3,qrcodeBorderColor:"rgb(255,255,255)"})})();var fileUrl=EmpGetSelfUrl("f"),type=EmpGetSelfUrl("t"),count=parseInt(EmpGetSelfUrl("c")),frameTime=parseInt(EmpGetSelfUrl("m")),isSmooth=.5<parseInt(EmpGetSelfUrl("s"))?!0:!1,isLoop=.5<parseInt(EmpGetSelfUrl("l"))?!0:!1,isAnimate=parseInt(EmpGetSelfUrl("a")),rotSpeed=parseInt(EmpGetSelfUrl("r")),isWrap=.5<parseInt(EmpGetSelfUrl("wp"))?!0:!1,width=parseFloat(EmpGetSelfUrl("w")),height=parseFloat(EmpGetSelfUrl("h"));isNaN(width)||isNaN(height)||$("#EMP2C34382C14251AC928A5056A58FC69D6").css({height:height/EmpBaseRem+"rem",width:width/EmpBaseRem+"rem",left:(1024-width)/(2*EmpBaseRem)+"rem",top:(1024-height)/(2*EmpBaseRem)+"rem"});empCreateAtx("EMP2C34382C14251AC928A5056A58FC69D6",{imagePath:fileUrl,totalImages:count,imageExtension:type,frameTime:frameTime,loop:isLoop,animate:isAnimate,rotSpeed:rotSpeed,smooth:isSmooth,wrap:isWrap});

	var swiper = new Swiper('.model',{
	    direction:"vertical",
	    loop:false, //一定要注意 ，如果加上loop:true 后， 就不要使用nth-child选择器了。
		effect:'coverflow',
	    onInit: function(swiper){ //Swiper2.x的初始化是onFirstInit
	        swiperAnimateCache(swiper); //隐藏动画元素
	        swiperAnimate(swiper); //初始化完成开始动画
	    },
	    onSlideChangeEnd: function(swiper){
	        swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画
	    }
	});
</script>
</body>
</html>